<template>
  <div>
    <van-search v-model="kw" autofocus placeholder="请输入搜索关键词" />

    <v-card :arr="arr"></v-card>
  </div>
</template>

<script>
// import axios from "axios";
import { reqsearch } from "../../http/http";
export default {
  data() {
    return {
      // 关键字
      kw: "",
      // 搜索的结果
      arr: [],
    };
  },
  watch: {
    // 监听kw
    kw() {
      if (this.kw === "") {
        this.arr = [];
        return;
      }
      reqsearch({
        keywords: this.kw,
      }).then((res) => {
        if (res.data.code === 200) {
          this.arr = res.data.list ? res.data.list : [];
        }
      });
    },
  },
};
</script>

<style lang="less" scoped>
@import "../../less/index.less";
.iconfont {
  line-height: 0.6rem;
  margin-left: 0.1rem;
}
.box {
  /* width: 6rem; */
  background-color: #fff;
  margin: 0.2rem;
  height: 0.6rem;
  border: 0.01rem solid #000;
  border-radius: 0.2rem;
  text-align: left;
}
.ss {
  border: 0;
  margin-left: 0.2rem;
}
.uul .con {
  width: 5rem;
  margin: 0.3rem auto;
  background-color: pink;
  text-align: center;
  border-radius: 0.2rem;
}
</style>